﻿$(function () {
    //jquery显示提示，鼠标放到图片img上时，显示图片的alt中内容，class='tooptip'
    var x = 10;//x偏移
    var y = 20;//y偏移
    $("img.tooltip").mouseover(function (e) {
        this.myAlt = this.alt;
        this.alt = "";
        var imgsrc = $("img", this).attr("bigimg");
        var imgTitle = this.myAlt
        var tooltip = "<div id='tooltip' style='width:200px' >" + imgTitle + "<\/div>"; //创建div
        $("body").append(tooltip); //把它追加到文档中
        $("#tooltip").css({
            "top": (e.pageY + y) + "px",
            "left": (e.pageX + x) + "px"
        }).show("fast");   //设置x坐标和y坐标，并且显示
    }).mouseout(function () {
        this.alt = this.myAlt;
        $("#tooltip").remove();  //移除 
    }).mousemove(function (e) {
        $("#tooltip").css({
            "top": (e.pageY + y) + "px",
            "left": (e.pageX + x) + "px"
        });
    });
    //jquery显示提示，鼠标放到链接a上时，显示链接里图片和a的title，a的class='tooptip'
    $("a.tooltip").mouseover(function (e) {
        this.myTitle = this.title;
        this.title = "";
        var imgsrc = $("img", this).attr("bigimg");
        var imgTitle = this.myTitle ? "<br/>" + this.myTitle : "";
        var tooltip = "<div id='tooltip'><img src='" + imgsrc + "' alt='预览图'/>" + imgTitle + "<\/div>"; //创建div
        $("body").append(tooltip); //把它追加到文档中
        $("#tooltip").css({
            "top": (e.pageY + y) + "px",
            "left": (e.pageX + x) + "px"
        }).show("fast");   //设置x坐标和y坐标，并且显示
    }).mouseout(function () {
        this.title = this.myTitle;
        $("#tooltip").remove();  //移除 
    }).mousemove(function (e) {
        $("#tooltip").css({
            "top": (e.pageY + y) + "px",
            "left": (e.pageX + x) + "px"
        });
    });
})
